<template>
  <div class="q-pa-md" style="display: flex;flex-direction: column;gap: 8px;">
    <t-btn-dropdown
      :staticItems="staticItems"
      @dropdownItemClick="onItemClick"
      labelPosition="top"
      label="下拉按钮"
      label-text="文字图标分割模式下拉按钮"
      showModel="auto"
      :hide-label="false"
      :popover="false"
      split
    ></t-btn-dropdown>

  </div>
</template>

<script>
import { onMounted, ref } from 'vue';
export default {
  setup() {
    const staticItems = [
      {
        label: '字数比较长的选项1',
        isDefaultBtn:true
      },
      { label: '选项2' },
      { label: '选项3',disabled:true},
    ];

    return {
      staticItems,
      onItemClick(item) {
        alert(item.label);
      },
    };
  },
};
</script>
